<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>OA模拟与实现</title>
    <link rel="stylesheet" th:href="@{/bootstrap/bootstrap-3.3.7-dist/css/bootstrap.min.css}"/>
    <script th:src="@{/js/jquery-3.2.1.min.js}"></script>
    <style>
      .tb{
          margin-top: 10px;
      }
      .mdanger{
          color: #FF0000;
          font-size: 12px;
          font-weight: bold;
      }
      .mlook{
          color: #2AF598;
          font-size: 12px;
          font-weight: bold;
      }
    </style>
    <script>
        $(function(){
            $("#select").click(function(){
                var rname = $("#reciveName").val();
                $(this).attr("href",'/message/sendmessage.html?reciver='+rname);
            })
        })
    </script>
</head>
<body>
    <div class="container-fluid">
        <ol class="breadcrumb nav-top">
            <li><a th:href="@{~/router/index.html}" target="main">首页</a></li>
            <li class="active">发送消息</li>
        </ol>
        <form class="form-inline">
            <div class="form-group">
              <label for="reciveName">接收人：</label>
              <input type="text" class="form-control" id="reciveName" placeholder="请输入接受人的姓名或职位">
            </div>
            <a href="" id="select" class="btn btn-primary">查询</a> <b>|</b>
            <a href="/message/toSendMessage" target="main" type="button" class="btn btn-primary">发送消息</a>
        </form>
        <table class="table table-striped tb">
            <thead>
                <tr class="text-center">
                    <td>编&nbsp;号</td>
                    <td>摘&nbsp;要</td>
                    <td>发送时间</td>
                    <td>接收人</td>
                    <td>发送方式</td>
                    <td>状态</td>
                    <td>操&nbsp;作</td>
                </tr>
            </thead>
            <tbody>
                <tr class="text-center" th:object="${sendMessage}" th:each="sendMessage : ${sendMessageList}">
                    <td th:text="*{mid}">#001</td>
                    <td th:text="*{#strings.substring(mcontent,0,2)}">王企鹅群无</td>
                    <td th:text="*{#dates.format(mtime,'yyyy-MM-dd')}">2020-5-9</td>
                    <td th:text="*{mtype == '群发'?mreciverposname:mrecivername}">辅导员</td> <!---群发是显示接受人的身份-->
                    <td th:text="*{mtype}">群发</td>
                    <td th:text="*{mtype=='群发'?mcount+'人查看':mstate==0?'未查看':'已查看'}" th:class="*{mstate==0?'mdanger':'mlook'}" class="mdanger">6人查看</td><!---群发是显示查看人数-->
                    <td>
                        <a th:href="@{/message/deleteMeg(mid=*{mid})}">删除</a>&nbsp;|&nbsp;
                        <a th:href="@{/message/toDetail(mid=*{mid})}">详情</a>
                    </td>
                </tr>
            </tbody>
            
        </table>
        <div class="text-center" th:if="${pageUtil.totalPage!=0}">
            <nav aria-label="Page navigation">
                <ul class="pagination">
                  <li>
                    <a th:href="@{/message/sendmessage.html(currentPage=${pageUtil.currentPage==1?1:pageUtil.currentPage - 1},reciver=${reciver})}" aria-label="Previous">
                      <span aria-hidden="true">&laquo;</span>
                    </a>
                  </li>
                  <li th:each="num : ${#numbers.sequence(1,pageUtil.totalPage)}"><a th:href="@{/message/sendmessage.html(currentPage=${num},reciver=${reciver})}" th:text="${num}">1</a></li>

                  <li>
                    <a th:href="@{/message/sendmessage.html(currentPage=${pageUtil.currentPage==pageUtil.totalPage?pageUtil.totalPage:pageUtil.currentPage + 1},reciver=${reciver})}" aria-label="Next">
                      <span aria-hidden="true">&raquo;</span>
                    </a>
                  </li>
                </ul>
              </nav>
        </div>
    </div>
</body>
</html>